/* 使用TDesign设计系统变量 */
@import '/variable.less';

.container {
  background-color: #f3f3f3;
  /* @bg-color-page */
  padding-bottom: 40rpx;
}

.qrcode-section {
  background: #ffffff;
  /* @bg-color-container */
  padding: 48rpx 0;
  /* @spacer-3 */
  margin-bottom: 16rpx;
  /* @spacer */
  display: flex;
  justify-content: center;
  align-items: center;
}

.qrcode-container {
  text-align: center;
}

.qrcode-wrapper {
  width: 400rpx;
  height: 400rpx;
  background: #f3f3f3;
  /* @bg-color-page */
  border-radius: 12rpx;
  /* @radius-default */
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto 32rpx;
  /* @spacer-2 */
  padding: 40rpx;
}

.order-number {
  font-size: 28rpx;
  /* @font-size-base */
  color: #383838;
  /* @gray-color-11 */
  font-weight: 500;
}


.section-title {
  font-size: 28rpx;
  /* @font-size-base */
  font-weight: 600;
  margin-bottom: 24rpx;
  /* @spacer-1 */
  color: rgba(0, 0, 0, 0.9);
  /* @text-color-primary */
}


.pickup-code {
  font-size: 32rpx;
  /* @font-size-m */
  color: #0052d9;
  /* @brand-color */
  font-weight: 600;
}



.product-item {
  display: flex;
  margin-bottom: 24rpx;
  /* @spacer-1 */
  padding-bottom: 24rpx;
  /* @spacer-1 */
  border-bottom: 1rpx solid #e7e7e7;
  /* @border-level-1-color */
}

.product-item:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

.product-image {
  width: 120rpx;
  height: 120rpx;
  border-radius: 6rpx;
  /* @radius-small */
  margin-right: 24rpx;
  /* @spacer-1 */
  background-color: #f3f3f3;
  /* @bg-color-page */
  display: flex;
  align-items: center;
  justify-content: center;
}

.product-image .image {
  width: 100%;
  height: 100%;
  border-radius: 6rpx;
  /* @radius-small */
}

.product-info {
  flex: 1;
}

.product-name {
  font-weight: 500;
  margin-bottom: 8rpx;
  color: rgba(0, 0, 0, 0.9);
  /* @text-color-primary */
}

.product-spec {
  font-size: 20rpx;
  /* @font-size-xs */
  color: rgba(0, 0, 0, 0.4);
  /* @text-color-placeholder */
  margin-bottom: 12rpx;
}

.product-price {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.price {
  color: #d54941;
  /* @error-color-6 */
  font-weight: 600;
}

.quantity {
  font-size: 35rpx;
  /* @font-size-xs */
  color: rgba(0, 0, 0, 0.4);
  /* @text-color-placeholder */
}


.amount-item.total {
  font-size: 28rpx;
  /* @font-size-base */
  font-weight: 600;
  margin-top: 16rpx;
  /* @spacer */
  padding-top: 16rpx;
  /* @spacer */
  border-top: 1rpx solid #e7e7e7;
  /* @border-level-1-color */
}

.footer {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: #ffffff;
  /* @bg-color-container */
  padding: 24rpx 32rpx;
  /* @spacer-1 @spacer-2 */
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-shadow: 0 -2rpx 8rpx 0 rgba(0, 0, 0, 0.06);
  /* @shadow-4 */
  gap: 16rpx;
  /* @spacer */
}

.cancel-btn {
  flex: 1;
  background-color: transparent;
  color: #5e5e5e;
  /* @gray-color-9 */
  border: 1rpx solid #c5c5c5;
  /* @gray-color-5 */
  padding: 20rpx 0;
  border-radius: 999px;
  /* @radius-round */
  font-size: 28rpx;
  /* @font-size-base */
}

.contact-btn {
  flex: 1;
  background-color: #0052d9;
  /* @brand-color */
  color: #ffffff;
  /* @text-color-anti */
  border: none;
  padding: 20rpx 0;
  border-radius: 999px;
  /* @radius-round */
  font-size: 28rpx;
  /* @font-size-base */
}

.confirm-btn {
  flex: 1;
  background-color: #0052d9;
  /* @brand-color */
  color: #ffffff;
  /* @text-color-anti */
  border: none;
  padding: 20rpx 0;
  border-radius: 999px;
  /* @radius-round */
  font-size: 28rpx;
  /* @font-size-base */
}

.cancel-btn:active {
  background-color: #f3f3f3;
  /* @bg-color-page */
}

.contact-btn:active {
  background-color: #003cab;
  /* @brand-color-active */
}

.confirm-btn:active {
  background-color: #003cab;
  /* @brand-color-active */
}